<template>
	<view :style="colorStyle">
		<view class="list" v-for="(item,index) in listData" :key='index' @click="jump(item)">
			<view class="list-image">
				<image :src="item.user.avatar" mode=""></image>
			</view>

			<view class="content">
				<view>
					<view class="title">{{item.user.nickname}}</view>
					<view class="title">{{item.phone}}</view>
				</view>
				<view class="sn">
					{{item.province}}{{item.city}}{{item.district}}{{item.town}}{{item.address}}
				</view>

			</view>
		</view>

		<view class="loadingicon acea-row row-center-wrapper">
			<!-- <text class="loading iconfont icon-jiazai" :hidden="loading == false"></text> -->
			我也是有底线的~~~
		</view>
	</view>
</template>

<script>
	import {
		getProxyList
	} from '@/api/user.js';
	export default {
		data() {
			return {
				listData: [],
				page: 1,
				limit: 10,
			}
		},
		onShow() {
			this.proxyList()
		},
		methods: {
			proxyList() {
				getProxyList({
					page: this.page,
					limit: this.limit
				}).then(res => {
					console.log(res, 'rrrrrrr')
					let list = res.data.list || [];
					this.listData = this.$util.SplitArray(list, this.listData);
					this.$set(this, 'listData', this.listData);
					
					this.page = this.page + 1
				})
			},
			jump(item) {
				uni.openLocation({
					latitude: Number(item.latitude),
					longitude: Number(item.longitude),
					success: function() {
						console.log('success');
					}
				});
				console.log(item, 'item')
			}
		},
		onReachBottom: function() {
			this.proxyList();
		}

	}
</script>

<style scoped lang="scss">
	.page {
		background-color: #fff;
	}

	.list {
		display: flex;
		flex-direction: row;
		margin-bottom: 30rpx;
		padding: 0 30rpx;


		.list-image {
			width: 200rpx;
			height: 200rpx;
			border-radius: 30rpx;
			overflow: hidden;

			image {
				width: 100%;
				height: 100%;
			}
		}

		.content {
			flex: 1;
			display: flex;
			flex-direction: column;
			justify-content: space-between;
			margin-left: 30rpx;

			.title {
				font-size: 34rpx;
			}

			.sn {
				font-size: 26rpx;
				color: #999;
			}
		}
	}
</style>
